<template>
	<div class="qrcontainer">
		<div class="header">
			<div @click="back()">取消</div>
			<div @click  ="setFlash">{{light}}</div>
		</div>
		<div id= "bcid" :style="{width:width+'px',height:width*4/2.88+'px'}" ></div>
		<div class="footer" @touchend="scanPicture">从相册选取</div>
	</div>
</template>
<style lang="less" scoped>
@import "~less/base";
.qrcontainer{//容器，沾满全屏
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index:100;
	color: @color-c;
	font-size: .3rem;
	background:#000000;
	.header{//顶部开灯取消
		background:#000000;
		line-height: .9rem;
		height: 8%;
		position: absolute;
		width: 100%;
		z-index: 1000;
		div:nth-child(1){
			float: left;
			margin-left: .2rem;
		}
		div:nth-child(2){
			float: right;
			margin-right: .2rem;
		}
	}
	.footer{//底部相册选取
		position: fixed;
		bottom: 0;
		height: 8%;
		width: 100%;
		line-height: .9rem;
		text-align: center;
		background:#000000;
		z-index: 1000;
	}
	#bcid {	//扫描容器
	//   width:8.2rem;  
	//   height:9rem;
	  margin-top:1.5rem;
	//   position: absolute;  	
	//   top: 8%;
    //   background: #000000; 
	}	
}
</style>
<script>
export default {
	data(){
		return{
			scan:null,
			light:"开灯",
			lightOpen:false,
			width: window.screen.width,
			height: window.screen.height,
		}
	},
	watch:{
		lightOpen(newVal,oldVal){
			if(newVal){
				this.light="关灯"
			}else{
				this.light="开灯"
			}
		}
	},
	methods:{
		onmarked( type, result ) {//扫描成功返回函数
					var text = '未知: ';
					switch(type){
						case plus.barcode.QR:
						text = 'QR: ';
						break;
						case plus.barcode.EAN13:
						text = 'EAN13: ';
						break;
						case plus.barcode.EAN8:
						text = 'EAN8: ';
						break;
					}
					// alert( text+result );//处理生成二维码效果
				let data={
							myphone:localStorage.myphone,
							mobilephone:result,
							userId:localStorage.userid,
						}
					this.$dialog.loading.open('请等待');
					this.$router.back();//先返回
					this.scan.cancel();
					this.scan.close();
					this.ylAjax.searchFriend(data)
						.then(res=>{
							if(res.state==0){
                                let a=res.data.user;
                                a.status1=res.data.statu1;
                                a.status2=res.data.statu2;
                                this.$store.commit("userDetail",a)
                                this.$store.commit("stateWrite",null)
                                this.$store.commit('searchPhone',result)
								this.$dialog.loading.close();
                                setTimeout(()=>{
                                    this.$router.push({path:'/common/userIntr',query:{status:'add'}})
                                },500)																
							}else{
								this.$dialog.loading.close();
                                this.$dialog.alert({mes:"请稍后再试"})								
							}
						})
			},
			back(){//顶部取消按钮
				history.go(-1);
				this.cancel()
			},
			cancel(){//关闭扫描控件方法
				this.scan.cancel();
				this.scan.close();	
			},
			startRecognize() {//创建扫描控件
				// var filter;//扫描控件样式
				var filter = [plus.barcode.QR];  
				var styles = {frameColor: "#29E52C",scanbarColor: "#29E52C",background: "transparent"}
						this.scan = new plus.barcode.Barcode('bcid',filter,styles);
						this.scan.onmarked =this.onmarked;
						this.startScan()
					},
			startScan() {//开始扫描
						this.scan.start();
					},
			 setFlash() {//开启闪光灯
				 
				 if(this.lightOpen){
					 this.scan.setFlash(false);
				 }else{
					this.scan.setFlash(true); 
				 }
				 this.lightOpen=!this.lightOpen;
				
			},
			 scanPicture() {//从相册选择图片识别
			 var onmarked=this.onmarked;
				plus.gallery.pick(function(path){
					plus.barcode.scan(path,onmarked,function(error){//错误处理函数
						alert( "无法识别此图片" );
					});
				},function(err){
					alert("Failed: "+err.message);
				});
		}
	},
	created(){

	},
	mounted(){
		var start=this.startRecognize;
		var back=this.cancel;
		setTimeout(function() {//组件加载完，延时启动扫描
				start();
		});
		plus.key.addEventListener("backbutton", function() {//安卓返回按键处理
					back()
				});
	},
	 deactivated(){//扫描完将组件销毁 
		this.$destroy()
	 },
}
</script>
